<template>
  <FileWordOutlined
    v-if="getFileType(fileName) === 'word'"
    style="color: #0960bd; font-size: 20px"
  />
  <FilePdfOutlined v-if="getFileType(fileName) === 'pdf'" style="color: #0960bd; font-size: 20px" />

  <FileImageOutlined
    v-if="getFileType(fileName) === 'image'"
    style="color: #0960bd; font-size: 20px"
  />
  <FileExcelOutlined
    v-if="getFileType(fileName) === 'excel'"
    style="color: #0960bd; font-size: 20px"
  />
  <span v-if="getFileType(fileName) === 'other'">--</span>
</template>

<script lang="ts" setup>
  import { getFileType } from '@/utils/common/index';
  import {} from 'vue';
  import {
    FileExcelOutlined,
    FileImageOutlined,
    FilePdfOutlined,
    FileWordOutlined,
  } from '@ant-design/icons-vue';

  // 获取外部传入的数据
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
  const props = defineProps({
    fileName: {
      type: String,
      default: () => {
        return '';
      },
    },
  });
  // console.log('btn', props);
</script>

<style scoped></style>
